<script setup lang="ts">
import { inject} from "vue";
import dayjs from "dayjs";
import {useCard} from "./data";
import {setMenu} from "@/config";
const cards = useCard()
const go:any = inject('go')
</script>

<template>
  <a-card
      v-for="item in cards" :key="item.key"
      hoverable
      :bordered="false"
      :title="item.title"
      style="margin: 1rem"
 >
   <template #extra>
     <span>{{dayjs().format("YYYY-MM-DD")}}</span>
   </template>
   <a-tag
       v-for="tag in item.tags"
       :key="tag.key"
       :color="tag.color"
       :bordered="false"
       style="margin-bottom: 0.8rem"
   >
      {{tag.label}}
   </a-tag>
   <a-flex justify="space-between">
     <a-card-meta
         :title="item.meta.title"
         :description="item.meta.description"
         style="width: 81%"
     />
     <a-image
         :width="136"
         :preview="false"
         class="image-set"
         :src="item.imgUrl"
         fallback=""
     />
   </a-flex>
   <template #actions>
     <a-button type="link" @click="go(item.to);setMenu(item.key,2)">点击进入</a-button>
   </template>
 </a-card>
</template>

<style scoped lang="scss">

</style>